<template>
    <baidu-map class="bm-view" :center="{lng: 116.404, lat: 39.915}" :zoom="11" :scroll-wheel-zoom="true">
      <bm-driving start="北京市" end="上海" @searchcomplete="handleSearchComplete" :panel="false" :autoViewport="true"></bm-driving>
        <bml-lushu
    @stop="reset"
    :path="path"
    :icon="icon"
    :play="play"
    :speed="speed"
    :rotation="true">
  </bml-lushu>
  </baidu-map>
</template>
<script>
import {BmlLushu} from 'vue-baidu-map'
export default {
  components: {
    BmlLushu
  },
   data() {
      return {
        play: true,
        speed:70000,
      path: [],
      icon: {
        url: 'http://api.map.baidu.com/library/LuShu/1.2/examples/car.png',
        size: {width: 52, height: 26},
        opts: {anchor: {width: 27, height:13}}
        }
      }
   },
   methods:{
     reset () {
      this.play = true
    },
    handleSearchComplete (res) {
      this.path = res.getPlan(0).getRoute(0).getPath()
    }
   },
   created(){
   },
   computed:{
   },
}
</script>
<style  scoped>
.bm-view {
  width: 100%;
  height: 700px;
}
</style>
